import React, {Component} from 'react';
import http from '../../http'

class SaveFormUpload extends Component {
	removeImage = item => {
		this.props.removeImage(item)
	}

	changeUpload = e => {
		let form = new FormData();
		form.append('upload_file', e.target.files[0]);
		http.saveUpload(form).then(res => {
			if (res.data) {
				this.props.onChange(res.data);
			}
		})
	}

	render() {
		return (
			<div className="form-file">
				{
					this.props.subImages.length > 0
						?
						<div className="col-md-10 form-images-containter">
							{
								this.props.subImages.map((item, index) => {
									return (
										<div className="form-images" key={index}>
											{
												this.props.disabled
													?
													''
													:
													<i className="fa fa-close fa-fw"
													   onClick={() => this.removeImage(item)}></i>
											}
											<img src={item.url} alt=""/>
										</div>
									)
								})
							}

						</div>
						:
						this.props.disabled
							?
							<div className="col-md-10">暂无图片</div>
							:
							<div className="col-md-10">请上传图片</div>
				}
				{
					this.props.disabled
						?
						''
						:
						<div className="col-md-10 col-md-offset-1 form-file-group">
							<input
								className="input-file"
								type="file"
								onChange={this.changeUpload}
							/>
						</div>
				}

			</div>
		);
	}
}

export default SaveFormUpload;